<template>
  <dt-modal-edit ref='edit' :title='title' :loading="loading" :label-width='100' okText='保存'
    :width='600' @ok='onOk'>
    <div class="select_uaser">
      <Row class="label_warp">
        <Col span="24" class="tips">
        <Icon type="md-alert" class="tips_icon" />
        <div>提示：如选择多个顾问，将平均分配线索</div>
        </Col>
      </Row>
      <dt-grid ref="table" :onFetch='onFetch' :select='select' :height='400' />
      <div v-if="showTips" class="setTips">当前所选线索为需要隐私号回拨，只能勾选承接人进行分配</div>
    </div>
  </dt-modal-edit>
</template>

<script>
  import columnOpt from '../opt/detailColumns'
  import clueImportApi from '@/biz/customer/clueImport'
  export default {
    data() {
      return {
        loading: false,
        title: '选择顾问 ',
        selected: [],
        showTips: false,
        list: [],
        buildingId: '',
        select: {
          checkbox: {
            checkMethod: ({ row }) => {
              if (this.showTips) {
                if (row.isReceiver == 1) {
                  return true
                } else {
                  return false
                }
              } else {
                return true
              }
            }
          },
          one: (selection, row) => {
            if (selection.some(i => i.userId == row.userId)) {
              this.selected.push(row)
            } else {
              let idx = this.selected.findIndex(i => i.userId == row.userId)
              if (idx >= 0) {
                this.selected.splice(idx, 1)
              }
            }
          },
          all: (selection) => {
            let tmp = []
            if (selection.length > 0) {
              selection.forEach(item => {
                if (!this.selected.some(i => i.userId == item.userId)) {
                  tmp.push(item)
                }
              })
              this.selected = [...this.selected, ...tmp]
            } else {
              this.list.forEach(item => {
                let idx = this.selected.findIndex((i, idx) => i.userId == item.userId)
                if (idx >= 0) {
                  this.selected.splice(idx, 1)
                }
              })
            }
          }
        },
      }
    },
    methods: {
      show(data) {
        console.log(data, 'data')
        this.showTips = data.isPrivacy == 1 ? true : false
        this.buildingId = data.buildingId
        this.selected = this.$tool.deepClone(data.selectUser)
        this.$refs.edit.show()
        this.$refs.table.init(this, new columnOpt.ColumnSelectUser(this))
        this.$refs.table.fetch()
      },
      //默认勾选
      findSelected(list) {
        let tmp = []
        list.forEach(item => {
          if (this.selected.some(i => i.userId == item.userId)) {
            tmp.push(item)
            // this.selected.push(item)
          }
        })
        this.$refs.table.selectRows(tmp)
      },
      onFetch() {
        let params = {
          buildingId: this.buildingId,
          haveRole: 1,
          onlineType: 1
        }
        return clueImportApi.adviserList(params).then(res => {
          this.findSelected(res)
          this.list = res
          return res
        })
      },
      onOk() {
        this.$emit('success', this.selected)
        this.selected = []
        this.$refs.edit.hide()
      }
    },
  }
</script>

<style lang='scss' scoped>
  .select_uaser {
    .label_warp {
      margin: 15px 0;
      background-color: rgba(254, 252, 236, 1);
      width: auto;
      line-height: 32px;
      padding: 10px;

      .tips {
        line-height: 20px;
        font-size: 14px;
        display: flex;
        justify-content: center;

        .tips_icon {
          font-size: 20px;
          color: #0f42a7;
          vertical-align: sub;
        }
      }
    }

    .setTips {
      color: #F59A23;
      margin-top: 16px;
      text-align: center;
    }
  }
</style>